<template>
    <div class="map">
        <baidu-map
            id="mapContent"
            class="bm-view"
            ak="W88BkHVnp0WogrVpk9cIVf7Mv9EdGSf1"
            :center="center"
            :zoom="zoom"
            :dragging="draggable"
            @ready="handler"
        >
            <bm-marker
                :position="{ lng: 116.404, lat: 33.915 }"
                :local="'北京市海淀区新建宫门路19号'"
                :dragging="draggable"
            >
            </bm-marker>
            <div class="shaode">
                <p>工作地点 <br />{{ company.address }}</p>
            </div>
        </baidu-map>
    </div>
</template>

<script>
// import { axiosPost } from '../../axios';
// import { Toast } from 'vant';
import BaiduMap from 'vue-baidu-map/components/map/Map.vue';
import BmMarker from 'vue-baidu-map/components/overlays/Marker.vue';
export default {
    name: '',
    components: {
        BaiduMap,
        BmMarker,
    },
    props: ['company'],
    data() {
        return {
            center: { lng: 116.404, lat: 39.915 },
            zoom: 18,
            draggable: false,
        };
    },
    computed: {},
    mounted() {},
    methods: {
        handler() {},
    },
};
</script>

<style lang="less" scope>
#mapContent {
    width: 15.1467rem;
    height: 5.12rem;
    position: relative;

    .shaode {
        position: absolute;
        left: 2.1333rem;
        top: 0.8533rem;
        width: 11.4347rem;
        height: 2.5173rem;
        background: #ffffff;
        border-radius: 0.4267rem;
        justify-content: center;
        display: flex;
        align-items: center;

        p {
            font-size: 0.5547rem;
            font-weight: 400;
            color: #000000;
            line-height: 0.768rem;
        }
    }
}
</style>
